<!DOCTYPE html>
<html lang="en">
<head>
    {include file='public/meta'/}
    <link rel="stylesheet" type="text/css" href="__STATIC_URL__/static/css/chioce.css"/>
<link rel="stylesheet" type="text/css" href="__STATIC_URL__/static/css/tidy.css"/>

    <script src="__STATIC_URL__/static/laydate/laydate.js"></script>
    <script src="__STATIC_URL__/static/js/times.js" type="text/javascript" charset="utf-8"></script>

</head>
<body>
{include file='public/header'/}
<section id="content">
    {include file='public/left'/}
    <div class="content">
        <div class="page-heading mgl15 mgr15">
            <ol class="breadcrumb">
                <li>当前位置是：</li>
                <li><a href="javascript:void(0);">粉丝管理</a></li>
                <li class="active" style="color: #02b87f;">粉丝列表</li>
            </ol>
        </div>
        <div class="panel panel-search panel-default mgl15 mgr15">
            <div class="panel-heading">
                <h5 class="panel-title"><span class="glyphicon glyphicon-search pull-left"
                                              style="margin-right: 10px;"></span>粉丝查找</h5>
            </div>
            <div class="panel-body">
                <form action="" method="get" class="form-horizontal table-search form-search" role="form" id="machform">
                    <div class="col-sm-6 col-md-6 col-lg-4 ">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">昵称：</label>
                            <div class="col-sm-9">
                                <input type="text" name="nickname" placeholder="昵称" class="form-control"
                                       value="{$p_data['nickname']}">
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-6 col-md-6 col-lg-4 ">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">性别：</label>
                            <div class="col-sm-9">
                                <select name="sex" class="form-control">
                                    <option value="">全部</option>
                                    <option value="1" {if condition="$p_data['sex'] eq '1' " }selected{
                                    /if}>男</option>
                                    <option value="2" {if condition="$p_data['sex'] eq '2' " }selected{
                                    /if}>女</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <!--<div class="col-sm-6 col-md-6 col-lg-4 ">-->
                        <!--<div class="form-group">-->
                            <!--<label class="col-sm-3 control-label">行业：</label>-->
                            <!--<div class="col-sm-9">-->
                                <!--<input type="text" class="form-control" name="" placeholder="请输入行业">-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="col-sm-6 col-md-6 col-lg-4 ">-->
                        <!--<div class="form-group">-->
                            <!--<label class="col-sm-3 control-label">爱好：</label>-->
                            <!--<div class="col-sm-9">-->
                                <!--<input type="text" class="form-control" name="" placeholder="请输入">-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                    <div class="col-sm-6 col-md-6 col-lg-4 ">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">分组：</label>
                            <div class="col-sm-9">
                                <select name="group" class="form-control">
                                    <option value="">全部</option>
                                    {volist name="grouplist" id="vogr"}
                                    <option value="{$vogr['id']}">{$vogr['group_name']}</option>
                                    {/volist}
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-6 col-md-6 col-lg-4">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">时间：</label>
                            <div class="col-sm-9">
                                <input name="search_date" type="text" value=""
                                       readonly="readonly" id="search_date" class="form-control"
                                       placeholder="请选择" style="width: 297px">
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="panel-footer">
                <a href="javascript:;" class="btn btn-primary" onclick="searchform()">查找</a>
                <a href="javascript:;" class="btn btn-default" onclick="clearform()">清空</a>
            </div>
        </div>
        <div class="panel panel-default mgl15 mgr15">
            <div class="panel-heading clearfixed" style="position: relative;">
                <h5 class="panel-title pull-left" style="line-height: 32px;">粉丝列表</h5>
                <!-- Single button -->
                {if condition="checkPath('wxfans/listgroup')"}
                <div class="dropdown pull-right" id="groupadmin">
                    <button class="btn btn-default btn-sm dropdown-toggle" type="button" id="dropdownMenu3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        分组管理
                        <span class="caret"></span>
                    </button>
                    <div class="dropdown-menu" aria-labelledby="dropdownMenu3" style="margin-top: 8px;">
                        <div style="min-width: 320px;">
                            <form action="">
                                <div style="margin: 15px;">
                                    <div class="form-group" id="list-group">

                                    </div>
                                </div>

                            </form>
                        </div>
                    </div>
                </div>
                {/if}
                {if condition="checkPath('wxfans/addgroup')"}
                <div class="dropdown pull-right mgr15">
                    <button class="btn btn-default btn-sm  dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                        新建分组
                        <span class="caret"></span>
                    </button>
                    <div class="dropdown-menu dropdown-menu-right" style="width: 300px;padding: 15px;"
                         aria-labelledby="dropdownMenu1">
                        <form action="" id="formGroup">
                            <div class="form-group">
                                <input type="hidden" name="wx_open_id" value="{$wechat.wx_open_id}">
                                <input type="hidden" name="top_mid" value="{$wechat.top_mid}">
                                <label  style="font-weight: 400;">分组名称：</label>
                                <input type="email" name="group_name" id="group_names" class="form-control" placeholder="请输入分组名称">
                            </div>
                            <div class="form-group clearfix" style="margin-bottom: 0;">
                                <span class="btn btn-success pull-left btn-sm" id="addGroup" >确定</span>
                                <span class="btn btn-default pull-right btn-sm"
                                      onclick="return $('#dropdownMenu1').dropdown('toggle')">取消</span>
                            </div>
                        </form>
                    </div>
                </div>
                {/if}
            
                {if condition="checkPath('wxfans/getfanslist')"}
                <div class="dropdown pull-right mgr15" >
                    <a class="btn btn-default btn-sm dropdown-toggle" href="{:url('wxfans/getfanslist')}"  aria-haspopup="true" aria-expanded="false">
                        粉丝同步
                    </a>
                </div>
                {/if}

                <div class="dropdown pull-right mgr15" >
                    <span class="btn btn-default btn-sm dropdown-toggle" aria-haspopup="true" aria-expanded="false">
                        总数：{$fans.sum}
                    </span>
                </div>
            </div>
            <div class="panel-body">
                    <table class="table table-bordered table-striped">
                        <thead>
                        <tr>
                            <th>
                                <span class="checkbox ng-scope checkbox-inline">
                                    <input type="checkbox" class="checkAll">
                                    <label class="ng-binding">全选</label>
                                </span>
                                {if condition="checkPath('wxfans/listgroup')"}
                                <span class="dropdown" id="groupshow">
                                    <button class="btn btn-default btn-sm dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                        选择分组
                                        <span class="caret"></span>
                                    </button>
                                    <div class="dropdown-menu" aria-labelledby="dropdownMenu2" style="margin-top: 8px;">
                                        <div style="min-width: 320px;">
                                            <form action="" id="doingGroup">
                                                <input type="hidden" id="wxopenid"  value="{$wechat.wx_open_id}">
                                                <input type="hidden" id="openid" name="openid">
                                                <input type="hidden" id="userid" name="id" >
                                                <input type="hidden" id="group" name="group" >
                                                <div style="margin: 15px;">
                                                    <div class="form-group" id="more-group">

                                                    </div>
                                                </div>
                                                <div class="form-group clearfix" style="margin-bottom: 0;border-top: 1px solid #999;padding: 15px;">
                                                    {if condition="checkPath('wxfans/setgroup')"}
                                                    <span class="btn btn-success btn-sm pull-left" id="fenzu">确定</span>
                                                    {/if}
                                                    <span class="btn btn-default btn-sm pull-right" onclick="return $('#dropdownMenu2').dropdown('toggle')">取消</span>
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                </span>
                                {/if}
                            </th>
                            <th>性别</th>
                            <!--<th>地址</th>-->
                            <!--<th>行业</th>-->
                            <!--<th>兴趣爱好</th>-->
                            <th>分组</th>
                            <th>关注时间</th>
                        </tr>
                        </thead>
                        <tbody>
                        {volist name="fanslist" id="vo"}
                        <tr>
                            <td>
                                <span class="checkbox ng-scope checkbox-inline">
                                    <input type="checkbox" class="checkSingel" data-id="{$vo.id}" data-openid="{$vo.openid}" value="">
                                    <label class="ng-binding"></label>
                                </span>
                                {if condition="$vo.head_url neq '' "}
                                <img style="width: 48px;height: 48px;" src="{$vo.head_url}" alt="">
                                {else/}
                                <img style="width: 48px;height: 48px;" src="__STATIC_URL__/static/images/fensi.jpg" alt="">
                                {/if}
                                <a href="{:url('wxfans/fansinfo')}?id={$vo.id}" class="btn-link">{$vo['nickname']}</a>
                            </td>
                            <td>{:get_wx_sex($vo['sex'])}</td>
                            <!--<td></td>-->
                            <!--<td></td>-->
                            <!--<td></td>-->
                            <td>{:get_user_group($vo['group'])}</td>
                            <td>
                                {$vo['create_time']}

                            </td>
                        </tr>
                        {/volist}
                        </tbody>
                    </table>
                    {$fanslist->render()}
            </div>
        </div>
        {include file='public/footer'/}
    </div>
</section>
<!-- 重命名Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">重命名</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" id="editgroup">
                    <div class="form-group">
                        <label class="col-sm-2 control-label">名称：</label>
                        <div class="col-sm-10">
                            <input type="hidden" name="id" id="reid">
                            <input type="text" class="form-control" name="group_name" id="rename" placeholder="请输入名称">
                        </div>
                    </div>
                </form>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" id="regroup">确认</button>
            </div>
        </div>
    </div>
</div>
<script>
    <!--添加分组-->
    $("#addGroup").click(function(){
        var name = $("#group_names").val();
        if(name==""){
            layer.alert('请输入分组名称',{icon:7});
            return false;
        }
        $.ajax({
            url:"{:url('wxfans/addgroup')}",
            type:"post",
            data:$("#formGroup").serialize(),
            success:function(data){
                console.log(data);
                if(data.code == "0"){
                    layer.msg(data.message,{icon:1});
                    $("#dropdownMenu1").dropdown("toggle");
                    return false;
                }else{
                    layer.alert(data.message,{icon:7});
                    return false;
                }
            }
        })
    })

    $(function(){

        $(".checkAll").click(function(){
            if(this.checked){
                $(".checkSingel").prop("checked",true);
            }else{
                $(".checkSingel").prop("checked",false);
            }

        });
//        显示分组信息
        $('#groupshow').on('show.bs.dropdown', function () {
//            获取选中得多个粉丝
            var checkbox = $(".checkSingel");
            var open = ""; //
            var id ="";
            for(var i=0;i<checkbox.length;i++){
                if(checkbox.eq(i).is(':checked')){
                    //获取选中粉丝的openid
                    var openid = checkbox.eq(i).attr("data-openid");
                    var userid = checkbox.eq(i).attr("data-id");
                    if(open == ""){
                        open = openid;
                        id = userid;
                    }else{
                        open+=","+openid;
                        id+=","+userid;
                    }
                }
            }
            if(open==""||id==""){
                layer.alert("请选择粉丝",{icon:7,title:"温馨提示"});
                return false;
            }
            $("#openid").val(open);
            $("#userid").val(id);
//            获取当前商户的多个分组
            var html = "";
            $.ajax({
                url:"{:url('wxfans/listgroup')}",
                type:"post",
                data:{},
                success:function(data){
                    var datas = data.data;
                    if(data.code=="0"){
                        for(i in datas){
                            html+='<span class="radio ng-scope radio-inline">'+
                                ' <input type="radio" name="name" value="'+datas[i].id+'" class="choice-group">' +
                                ' <label class="ng-binding">'+datas[i].group_name+'</label>'+
                                '</span>'
                        }
                    }
                    $("#more-group").html(html)
                }
            });
        });
        $('#groupshow').on('hide.bs.dropdown', function () {
            $("#more-group").html("")
        });
        $("#fenzu").click(function(){
            var radio = $(".choice-group");
            for(var i=0;i<radio.length;i++){
                if(radio.eq(i).is(':checked')){
                    //获取选中粉丝的openid
                    var id = radio.eq(i).val();
                }
            }
            $("#group").val(id);
            $.ajax({
                url:"{:url('wxfans/setgroup')}",
                type:"post",
                data:$("#doingGroup").serialize(),
                success:function(data){
                    console.log(data)
                    if(data.code=="0"){
                        layer.msg(data.message,{icon:1});
                        setTimeout("window.location.reload()",1000);
                        return false;
                    }else{
                        layer.alert(data.message);
                        return false;
                    }
                }
            })
        });
        //        显示分组信息
        $('#groupadmin').on('show.bs.dropdown', function () {
//            获取当前商户的多个分组
            var html = "";
            $.ajax({
                url:"{:url('wxfans/listgroup')}",
                type:"post",
                data:{},
                success:function(data){
                    var datas = data.data;
                    if(data.code=="0"){
                        for(i in datas){
                            html+='<span class="radio ng-scope radio-inline" style="width: 100%;"><div class="pull-left">'+
                                ' <label class="ng-binding">'+datas[i].group_name+'</label></div>'+
                                '<div class="pull-right mgl15 text-danger delgroup" data-id="'+datas[i].id+'" data-name="'+datas[i].group_name+'" style="margin-top: 2px;">删除</div>'+
                                '<div class="pull-right mgl15 rename" data-id="'+datas[i].id+'" data-name="'+datas[i].group_name+'" style="margin-top: 2px;"> 重命名</div>'+
                                '</span>'
                        }
                    }
                    $("#list-group").html(html)
                }
            });
        });
        $("#list-group").on("click",".rename",function(){
           var id = $(this).attr("data-id");
           var name = $(this).attr("data-name");
           $("#reid").val(id);
           $("#rename").val(name);
           $("#myModal").modal("show");
        });
        $("#regroup").click(function(){
           $.ajax({
               url:"{:url('wxfans/editgroup')}",
               type:'post',
               data:$("#editgroup").serialize(),
               success:function(data){
                   console.log(data)
                   if(data.code==0){
                       layer.msg(data.message,{icon:1});
                       setTimeout("window.location.reload()",1000);
                       return false;
                   }else{
                       layer.alert(data.message,{icon:7});
                       return false;
                   }
               }
           })
        });
        $('#myModal').on('hide.bs.modal', function () {
            $("#reid").val('');
            $("#rename").val('');
        });
        $('#groupadmin').on('hide.bs.dropdown', function () {
            $("#list-group").html("")
        });
        $("#list-group").on("click",".delgroup",function(){
            var name = $(this).attr("data-name");
            var id = $(this).attr("data-id");
            layer.confirm('确认删除该'+name+'吗？', {
                btn: ['确认','取消'] //按钮
            }, function(){
                $.ajax({
                    url:"{:url('wxfans/delgroup')}",
                    type:'post',
                    data:{
                        id:id
                    },
                    success:function(data){
                        console.log(data)
                        if(data.code==0){
                            layer.msg(data.message,{icon:1});
                            setTimeout("window.location.reload()",1000);
                            return false;
                        }else{
                            layer.alert(data.message,{icon:7});
                            return false;
                        }
                    }
                })
                layer.msg('的确很重要', {icon: 1});
            }, function(){

            });
        })
    })
</script>
</body>
</html>